/**
 * Created by zhanglihe on 15/11/17.
 */
require.config(require_config);

define([
    'jquery',
    'common',
    'ready',
    'template',
    'collection',
    'model',
    'dialog'
], function( $, common, ready, template, Collection, Model, dialog ) {

    var type = 9; //默认显示总后台
    var index = function() {
        this.init();
    };
    index.prototype = {
        init: function() {
            loading();
            this.event();
            this.fetch();
        },

        fetch: function(_args) {
            var _this = this;
            //获取顶级资源
            $.ajax({
                url: _global.url.api + 'resource',
                type: 'get',
                data: {type: type, pid: 0},
                async: false,
                success: function(res) {
                    _this.parent = res.code == 0 ? res.data : [];
                }
            });

            var args = _args || {type: type};
            this.collection = new Collection({
                container: 'data-list',
                template: 'data-item',
                url: _global.url.api + 'resource',
                condition: args,
                show_page: false,
                model: {
                    tag_name: 'tr',
                    url: _global.url.api + 'resource/{id}',
                    event: {
                        '.item-edit:click': 'edit'
                    },
                    valid_config: {name: 'required'},
                    edit: function(e) {
                        var model = this;
                        e.preventDefault();
                        dialog({
                            width: 400,
                            content: template('add-tpl', {resource: this.data,parent: _this.parent}),
                            ok: function() {
                                model.data.pid = $('[name="pid"]').val();
                                model.data.name = $('[name="name"]').val();
                                model.data.routes = $('[name="routes"]').val().split("\n");
                                model.data.listorder = $('[name="listorder"]').val();
                                if(!model.put()) {
                                    return false;
                                }
                            },cancel: function() {}
                        }).show();
                    }
                },
                render_item: function(key, item) {
                    $.extend(this.model, {
                        data: item,
                        template: this.template
                    });
                    this.models[item.id] = new Model(this.model);
                    this.models[item.id].create_element();
                    if(item.pid > 0) {
                        this.models[item.pid].el.after(this.models[item.id].el);
                    } else {
                        this.el.append(this.models[item.id].el);
                    }
                },
                callback: function() {
                    loaded();
                }
            });
            this.collection.fetch();
        },

        event: function() {
            var _this = this;
            /**
             * 添加事件
             */
            $('#btn-add').on('click',function(e) {
                e.preventDefault();
                _this.data = {type: type}; ////表单临时变量
                dialog({
                    title: '添加资源',
                    width: 500,
                    content: template('add-tpl', {parent: _this.parent}),
                    ok: function() {
                        if(!new Model({
                                url: _global.url.api + 'resource',
                                data:_this.data,
                                valid_config: {
                                    name: 'required'
                                }
                            }).post()) {
                            return false;
                        }
                        _this.fetch();
                    },cancel: function() {}
                }).show();
                //绑定表单元素更改事件
                $('input, select, textarea').on('change', function(e) {
                    _this.change(e);
                });
            });

            //切换type
            $('#btn-type').find('a').on('click', function(e) {
                e.preventDefault();
                type = $(e.target).attr('rel');
                $(e.target).addClass('active').siblings().removeClass('active');
                _this.fetch();
            });
        },

        change: function(e) {
            if($(e.target).attr('name') == 'routes') {
                this.data.routes = $(e.target).val().split("\n");
                return;
            }
            this.data[$(e.target).attr('name')] = $(e.target).val();
        }

    };

    new index();

});